import {FC, useState} from "react"
import styled from './login.module.scss'
import Sms from "../../componets/Sms";
interface Props {}


const Index: FC<Props> = ()=> {
    const [formData,setFormData] = useState({
        mobile:'',
        code:''
    })


    const onChange = (e:React.ChangeEvent<HTMLInputElement>)=>{
        formData[e.target.name as 'mobile' | 'code'] = e.target.value
        setFormData({...formData})
    }

    const { mobile,code } = formData
    return (
        <div className={styled.login}>
            <img src={require('../../assets/logo2.jpg')} alt=""/>
            <form action="">
                <div>
                    <input type="text" placeholder="手机号" value={mobile} name='mobile' onChange={onChange}/>
                    <Sms mobile={mobile}></Sms>
                </div>
                <div>
                    <input type="text" placeholder="验证码" value={code} name='code' onChange={onChange}/>
                </div>
                <button>登录</button>
            </form>
            <span>收不到验证码</span>
        </div>
    )

}

export default Index
